<?xml version='1.0' encoding='UTF-8' ?>

<!DOCTYPE html PUBLIC
  "-//W3C//DTD XHTML 1.0 Transitional//EN" 
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui"
	xmlns:c="http://java.sun.com/jsp/jstl/core">
<h:head>
	<title>Editar Carro</title>
</h:head>

<h:body>

	<h:form>
		<p:fieldset legend="Editar"
			style="margin-bottom:20px; margin-left: 20px;
	margin-right: auto; font-size:12px;">
			<p:messages id="messages" showDetail="false" autoUpdate="true"
				closable="true" />

			<h:panelGrid columns="1">
				<p:outputLabel></p:outputLabel>
				

				<p:dataTable id ="productos" var="p" value="#{ejemploMB.listProductos}"
					rows="10" paginator="true"
					paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
					rowsPerPageTemplate="5,10,15">
					<p:column headerText="Producto">
						<h:outputText value="#{p.nombreProducto}" />
					</p:column>
					<p:column headerText="Precio">
						<h:outputText value="#{p.precioProducto}" />
					</p:column>
					<p:column headerText="Cantidad">
						<h:outputText id="cant" value="#{p.catidadProducto}" />
						<p:commandButton value="Agregar">
						  <f:ajax event="click" listener="#{ejemploMB.sumar(p)}" render="cant total"/>
						</p:commandButton>
						<p:commandButton value="Quitar">
						  <f:ajax event="click" listener="#{ejemploMB.restar(p)}" render="cant total"/>
						</p:commandButton>
					</p:column>
					<p:column headerText="Total">
						<h:outputText id ="total" value="#{p.totalProducto}" />
					</p:column>
					<p:column headerText="Eliminar">
						<p:commandButton 
							value="Eliminar">
							<f:ajax event="click" listener="#{ejemploMB.eliminarDetalle(p)}" render="productos"/>
						</p:commandButton>
					</p:column>
				</p:dataTable>
				
				<h:panelGrid columns="2">
					<p:commandButton action="#{ejemploMB.volverIndex()}" value="Volver"></p:commandButton>
					<p:commandButton action ="#{ejemploMB.comprar()}" value="Comprar"></p:commandButton>
				</h:panelGrid>
			</h:panelGrid>
		</p:fieldset>
	</h:form>
</h:body>
</html>